<%-- 
    Document   : admin_createProduct
    Created on : Mar 22, 2014, 11:28:14 AM
    Author     : Dell
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<jsp:include page="admin_header.jsp" />

<style>
#ftable
{
background-color:#fff;
text-align:center;
margin: 0 auto;
margin-top:5px;
width:300px;
border-collapse:collapse;
}
#ftable tr  td
{
padding:5px;


}
#ftable tr td
{
    min-width: 200px;
}
#ftable th
{
    font-size: 15px;
}

</style>
<!-- body -->
<div class='topblock'>

    <center>Create product</center>
	
</div>

<div class='pageblock'>	
	
    <center>
    
            <form action="myUpload" method="POST" enctype="multipart/form-data">
                
        <table id="ftable">
            <tr> <td style="text-align:right;">Category</td> <td> <select name="category" id="mycat"></select> </td> <td id="req1" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Name</td> <td><input type="text" name="name" id="name"/></td> <td id="req2" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Price</td> <td><input type="text" name="price" id="price"/></td> <td id="req3" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Amount</td> <td><input type="text" name="amount" id="amount"/></td> <td id="req4" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Brand</td> <td><input type="text" name="brand" id="brand"/></td> <td id="req5" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Description</td> <td><input type="text" name="desc" id="desc"/></td> <td id="req6" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Sizes</td> <td><input type="checkbox" name="size1" value="S" />Small &nbsp; <input type="checkbox" name="size2" value="M" />Medium &nbsp;<input type="checkbox" name="size3" value="L" />Large </td> <td id="req7" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Colors</td> <td><input type="text" name="color" id="color" placeholder="Red, Green, Blue, etc" /></td> <td id="req8" style="color: red;"></td> </tr>
            
            <tr> <td style="text-align:right;">Image</td> <td style="text-align:right;"><input type="file" name="image" id="image" /></td> <td id="req9" style="color: red;"></td> </tr>
            
            
            
        </table>
    
                <br/>
                <input type="submit" name="submit" id="submit" value="Create" />
                </form>
    </center>
    
</div>
<!--END-->
<script>
    $( document ).ready(function() {
        $("#mycat").load("ServletViewCategory");
        $('#submit').click(function(e) {
            
            
            
            for(var i=1;i<10;i++)
                document.getElementById("req"+i).innerHTML = "";
            
            if($("#mycat").val() == "")
            {
                document.getElementById("req1").innerHTML = "*Required";
                e.preventDefault();
                $("#mycat").focus();
            }
            
            else if($("#name").val() == "")
            {
                document.getElementById("req2").innerHTML = "*Required";
                e.preventDefault();
                $("#name").focus();
            }
            else if($("#name").val().length <=3)
            {
                document.getElementById("req2").innerHTML = "*Must be longer than 3";
                e.preventDefault();
                $("#name").focus();
            }
            else if(!isNaN($("#name").val()))
            {
                document.getElementById("req2").innerHTML = "*Must be alphanumeric";
                e.preventDefault();
                $("#name").focus();
            }
            
           else if($("#price").val() == "")
            {
                document.getElementById("req3").innerHTML = "*Required";
                e.preventDefault();
                $("#price").focus();
            }
            else if(isNaN($("#price").val()))
            {
                document.getElementById("req3").innerHTML = "*Must be a number";
                e.preventDefault();
                $("#price").focus();
            }
            else if($("#amount").val() == "")
            {
                document.getElementById("req4").innerHTML = "*Required";
                e.preventDefault();
                $("#amount").focus();
            }
            else if(isNaN($("#amount").val()))
            {
                document.getElementById("req4").innerHTML = "*Must be a number";
                e.preventDefault();
                $("#amount").focus();
            }
            else if($("#brand").val() == "")
            {
                document.getElementById("req5").innerHTML = "*Required";
                e.preventDefault();
                $("#brand").focus();
            }
            else if($("#desc").val() == "")
            {
                document.getElementById("req6").innerHTML = "*Required";
                e.preventDefault();
                    $("#desc").focus();
            }
            
                else if(document.getElementsByName("size1")[0].checked ==false && document.getElementsByName("size2")[0].checked ==false && document.getElementsByName("size3")[0].checked ==false )
                {
                    document.getElementById("req7").innerHTML = "*Required one atleast";
                    e.preventDefault();
                        document.getElementsByName("size1")[0].focus();
                }
          else  if($("#color").val() == "")
            {
                document.getElementById("req8").innerHTML = "*Required";
                e.preventDefault();
                $("#color").focus();
            }
            else if($("#color").val().length <3)
            {
                document.getElementById("req8").innerHTML = "*Must be longer than 2";
                e.preventDefault();
                $("#color").focus();
            }
            else if(!isNaN($("#color").val()))
            {
                document.getElementById("req8").innerHTML = "*Must be alphabetic";
                e.preventDefault();
                $("#color").focus();
            }
            
            else if($("#image").val() == "")
            {
                document.getElementById("req9").innerHTML = "*Required";
                e.preventDefault();
                $("#image").focus();
            }
             else{
                 
                 switch($("#image").val().substring($("#image").val().lastIndexOf('.') + 1).toLowerCase()){
        case 'gif': case 'jpg': case 'png':
            break;
        default:
            e.preventDefault();
            $("#image").val("");
           document.getElementById("req9").innerHTML = "*Not an image";
            break;
    }
    
             }
        
            
            
          });
});

</script>
<jsp:include page="admin_footer.jsp" />